<%@page import="inventory.InventoryItem"%>
<%@page import="model.UserPage"%>
<%@page import="database.Database"%>
<%UserPage u = (UserPage) request.getAttribute("model");%>  
<%Database d = (Database) request.getAttribute("database");%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <title>Book Content</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link rel="stylesheet" type="text/css" href="css/book_content.css"/>
        <link type="text/css" href="css/jquery-ui-1.8.20.custom.css" rel="Stylesheet" />	
        <script type="text/javascript" src="jquery/jquery.js"></script>
        <script type="text/javascript" src="jquery/jquery-ui-1.8.20.custom.min.js"></script>
        <script>      
            $(document).ready(function() {
                $(".bookDetails").hide();
                
                $(".bookTitle").click(function() {
                    var id = $(this).attr("id").substring(9);
                    if($("#bookDetails" + id).is(":visible"))
                        $("#bookDetails" + id).fadeOut(300);
                    else
                        $("#bookDetails" + id).fadeIn(300); 
                });
                
                $('.bookLend').click(function() {
                    var id = $(this).attr("id").substring(8);
                    var unenscapedTitle = $("#bookTitle" + id).html();
                    var bookTitle = escape(unenscapedTitle);

                    var formHeader = "<form action='index.jsp' method=POST>";
                    var contentHTML = "Enter the username of the person you want to lend this book to: <br><input type='text' name='usernameOfReceiver'><input type='submit' value='Lend'>";
                    var hiddenData = "<input type='hidden' name='model' value='UserPage'>";
                    hiddenData += "<input type='hidden' name='view' value='UserPageHTML'>";
                    hiddenData += "<input type='hidden' name='action' value='LendItem'>";
                    hiddenData += "<input type='hidden' name='bookTitle' value='" + bookTitle + "'>";
                    
                    
                    var formFooter = "</form>";
                    
                    var bookLend = $('<div></div>')                   
                    .html(formHeader + contentHTML + hiddenData + formFooter)
                    .dialog({
                        autoOpen: false,
                        title: unenscapedTitle,
                        resizable: false,
                        draggable: false,
                        modal: true
                    });
                    bookLend.dialog('open');
                    // prevent the default action, e.g., following a link
                    return false;
                });
                
                $('.bookReturn').click(function () {
                    var id = $(this).attr("id").substring(10);
                    var owner = $(this).html().substring(20);
                    var unenscapedTitle = $("#bookTitle" + id).html();
                    var bookTitle = escape(unenscapedTitle);
                    
                    var formHeader = "<form action='index.jsp' method=POST>";
                    var contentHTML = "Return this book to " + owner + "<br><input type='submit' value='Return'>";
                    var hiddenData = "<input type='hidden' name='model' value='UserPage'>";
                    hiddenData += "<input type='hidden' name='view' value='UserPageHTML'>";
                    hiddenData += "<input type='hidden' name='action' value='ReturnItem'>";
                    hiddenData += "<input type='hidden' name='bookTitle' value='" + bookTitle + "'>";
                    hiddenData += "<input type='hidden' name='usernameOfOwner' value='" + owner + "'>";
                    
                    var formFooter = "</form>";
                    
                    var bookLend = $('<div></div>')                   
                    .html(formHeader + contentHTML + hiddenData + formFooter)
                    .dialog({
                        autoOpen: false,
                        title: unenscapedTitle,
                        resizable: false,
                        draggable: false,
                        modal: true
                    });
                    bookLend.dialog('open');
                    // prevent the default action, e.g., following a link
                    return false;
                });
                
                $('.bookRequest').click(function () {
                    var id = $(this).attr("id").substring(11);
                    var borrower = $(this).html().substring(23);
                    var unenscapedTitle = $("#bookTitle" + id).html();
                    var bookTitle = escape(unenscapedTitle);
                    
                    var formHeader = "<form action='index.jsp' method=POST>";
                    var contentHTML = borrower + " has it.<br><input type='submit' value='Request it back'>";
                    var hiddenData = "<input type='hidden' name='model' value='UserPage'>";
                    hiddenData += "<input type='hidden' name='view' value='UserPageHTML'>";
                    hiddenData += "<input type='hidden' name='action' value='ReturnItem'>";
                    hiddenData += "<input type='hidden' name='bookTitle' value='" + bookTitle + "'>";
                    
                    var formFooter = "</form>";
                    
                    var bookLend = $('<div></div>')                   
                    .html(formHeader + contentHTML + hiddenData + formFooter)
                    .dialog({
                        autoOpen: false,
                        title: unenscapedTitle,
                        resizable: false,
                        draggable: false,
                        modal: true
                    });
                    bookLend.dialog('open');
                    // prevent the default action, e.g., following a link
                    return false;
                });
            });
        </script>
    </head>

    <body>
        <div style="padding: 20px;">
        <%
            for (int i = 0; i < u.user.getInventoryArraySize(); ++i) {
                out.print("<div class='book' id='book" + i + "'>");

                out.print("<div class='bookTitle' id='bookTitle" + i + "'>");
                out.print(u.user.getItem(i).itemName);
                out.print("</div>");

                out.print("<div id='bookDetails" + i + "' class='bookDetails'>");
                out.print("<div class='bookAuthor'>");
                out.print("By " + u.user.getItem(i).itemAuthor);
                out.print("</div>");

                out.print("<div class='bookSummary'>");
                out.print(u.user.getItem(i).itemSummary);
                out.print("</div>");

                out.print("<div class='bookISBN'>");
                out.print("ISBN: " + u.user.getItem(i).itemISBN);
                out.print("</div>");
                out.print("</div>");

                out.print("<div id='bookStatus" + i + "' class='bookStatus'>");
                if (u.user.getItem(i).status == 101) {
                    out.print("<div id='bookLend" + i + "' class='bookLend'>");
                    out.print("Lend this book");
                    out.print("</div>");
                } else {
                    if (u.user.getItem(i).ownerID != u.user.id) {
                        out.print("<div id='bookReturn" + i + "' class='bookReturn'>");
                        out.print("Return this book to " + d.getUserByID(u.user.getItem(i).ownerID).username);
                        out.print("</div>");
                    } else {
                        out.print("<div id='bookRequest" + i + "' class='bookRequest'>");
                        out.print("Request book back from " + d.getUserByID(u.user.getItem(i).userID).username);
                        out.print("</div>");
                    }
                }
                out.print("</div>");

                out.print("</div>");
            }
        %>
        </div>
    </body>
</html>
